<!--
 作者 : 唐梓元
 日期 : 2019-7-15
 版本 : 1.0
 描述 :管理页面右边顶部导航
 使用 : <entranceRightNav :rightNav="rightNav"></entranceRightNav>
 参数 :rightNav 为父组件传过来的表格数据
 -->
<template>
  <div class="rightNav f-bian">
    <div class="navL flex">
      <span v-text="`${rightNav.title}：`"></span>
      <ul class="flex">
        <li v-if="rightNav.leftLI" v-for="(item,index) in rightNav.leftLI" :key="index" @click="do_rightNav(item.text,rightNavFrom)">
          <span :style="{'color':item.iconColor,'fontSize':item.iconSize}" :class="`iconfont icon-${item.icon}`"></span> {{item.text}}</li>
        <!--<li> <span :style="`{'color':'red','fontSize':'18px'}`" class="iconfont icon-bianji"></span> 修改</li>-->
      </ul>
    </div>
    <div class="navR">
      <div class="pointer" v-if="rightNav.rightLI" v-for="(item,index) in rightNav.rightLI" :key="index" @click="do_rightNav(item.text,rightNavFrom)">
        <span :style="{'color':item.iconColor,'fontSize':item.iconSize}" :class="`iconfont icon-${item.icon}`"></span> {{item.text}}</div>
    </div>
  </div>
</template>

<script>
    export default {
        name: "cm_entranceRightNav",
      data(){
          return{

          }
      },
      props:{
          rightNav:Object,
        rightNavFrom:String
      },
      created(){
          console.log(this.rightNav)
      },
      methods:{
        do_rightNav(item,item2){
          // alert(item2)
          this.$emit('do_rightNav',`${item}-${item2}`)
          // this.$emit('do_rightNav',item,item2)
        }
      }
    }
</script>

<style scoped>
  .iconfont{
    margin-right: 3px;

  }
  .rightNav{
    height: 50px;
    line-height: 50px;
    /*border: 1px solid red;*/
    margin: 10px 0;
  }
  ul{
    margin: 0;

  }
  ul li{
    /*border: 1px solid;*/
    padding: 0 25px;
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
  }
  ul li:after{
    content: '';
    position: absolute;
    height: 18px;
    width: 1px;
    background-color: #c4c4c4;
    right: 0;
    top: 18px;
  }
  ul li:last-child:after{
    width: 0px;
  }
  .navL>span{
    color: #418EFD;
  }
  .icon-excel{
    position: relative;
    left: 15px;
  }
</style>
